<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/jsp/common/head.jsp"%>

<div class="right">
       <div class="location">
           <strong>你现在所在的位置是:</strong>
           <span>订单管理页面</span>
       </div>
       <div class="search">
       <form method="post" action="${pageContext.request.contextPath }/billList">
			<span>商品名称：</span>
			<input name="queryProductName" type="text" value="${queryProductName }">
			 
			<span>供应商：</span>
			<select name="queryProviderId">
				<option value="0">--请选择--</option>
				<c:forEach items="${providers}" var="provider">
					<c:if test="${queryProviderId == provider.id}" var="flag">
						<option value="${provider.id}" selected>${provider.proName}</option>
					</c:if>
					<c:if test="${!flag}">
						<option value="${provider.id}">${provider.proName}</option>
					</c:if>
				</c:forEach>
       		</select>
			 
			<span>是否付款：</span>
			<select name="queryIsPayment">
				<option value="0">--请选择--</option>
				<option value="1" <c:if test="${queryIsPayment == 1 }">selected</c:if>>未付款</option>
				<option value="2" <c:if test="${queryIsPayment == 2 }">selected</c:if>>已付款</option>
       		</select>
		   <input type="hidden" name="pageNo" value="1"/>
		    <input	value="查 询" type="submit" id="searchbutton">
		    <a href="${pageContext.request.contextPath }/toAddBill">添加订单</a>
		</form>
       </div>
       <!--账单表格 样式和供应商公用-->
      <table class="providerTable" cellpadding="0" cellspacing="0">
          <tr class="firstTr">
              <th width="10%">订单编码</th>
              <th width="20%">商品名称</th>
              <th width="10%">供应商</th>
              <th width="10%">订单金额</th>
              <th width="10%">是否付款</th>
              <th width="10%">创建时间</th>
              <th width="30%">操作</th>
          </tr>
		  <c:forEach items="${pageSupport.data}" var="bill">
			  <tr>
				  <td>
					  <span>${bill.billCode}</span>
				  </td>
				  <td>
					  <span>${bill.productName}</span>
				  </td>
				  <td>
					  <span>${bill.providerName}</span>
				  </td>
				  <td>
					  <span>${bill.totalPrice}</span>
				  </td>
				  <td>
					<span>
						${bill.isPayment == 1 ? "未付款" : "已付款"}
					</span>
				  </td>
				  <td>
				<span>
					<fmt:formatDate value="${bill.creationDate}" pattern="yyyy-MM-dd"></fmt:formatDate>
				</span>
				  </td>
				  <td>
					  <span><a class="viewBill" href="/toViewBill?id=${bill.id}" ><img src="${pageContext.request.contextPath }/images/read.png" alt="查看" title="查看"/></a></span>
					  <span><a class="modifyBill" href="/toModBill?id=${bill.id}" ><img src="${pageContext.request.contextPath }/images/xiugai.png" alt="修改" title="修改"/></a></span>
					  <span><a class="deleteBill" href="javascript:void(0);" delBillId="${bill.id}" ><img src="${pageContext.request.contextPath }/images/schu.png" alt="删除" title="删除"/></a></span>
				  </td>
			  </tr>
		  </c:forEach>

      </table>
	  <c:import url="rollpage.jsp"></c:import>
  </div>
</section>

<!--点击删除按钮后弹出的页面-->
<div class="zhezhao"></div>
<div class="remove" id="removeBi">
    <div class="removerChid">
        <h2>提示</h2>
        <div class="removeMain">
            <p>你确定要删除该订单吗？</p>
            <a href="#" id="yes">确定</a>
            <a href="#" id="no">取消</a>
        </div>
    </div>
</div>

<%@include file="/WEB-INF/jsp/common/foot.jsp" %>

<script type="text/javascript">
	// 删除弹窗简单用法
	var delBillId;
	function openYesOrNoDLG(){
		$('.zhezhao').css('display', 'block');
		$('#removeBi').fadeIn();
	}

	function cancleBtn(){
		$('.zhezhao').css('display', 'none');
		$('#removeBi').fadeOut();
	}
	function changeDLGContent(contentStr){
		var p = $(".removeMain").find("p");
		p.html(contentStr);
	}

	// 点击删除
	$(".deleteBill").click(function (){
		delBillId = $(this).attr("delBillId");
		changeDLGContent("确定要删除此订单吗？");
		openYesOrNoDLG();
	});

	$('#no').click(function () {
		cancleBtn();
	});

	$('#yes').click(function () {
		// 推荐用ajax实现异步删除
		location.href = "/billDel&id=" + delBillId;
	});
</script>